<template>
  <div class="user-page">
    <users :user="user" />
    <button @click="updateUser">更新用户信息</button>
  </div>
</template>

<script setup>
import { ref } from "vue";
import users from "../components/项目三/users.vue";

const user = ref({
  name: "张三",
  age: 18,
  email: "zhangsan@example.com",
  phone: "无",
});

function updateUser() {
  user.value = {
    name: "李四",
    age: 20,
    email: "lisi@example.com",
    phone: "有",
  };
}
</script>

<style scoped>
.user-page {
  max-width: 600px;
  margin: 20px auto;
}
button {
  margin-top: 10px;
  padding: 8px 16px;
  cursor: pointer;
}
</style>
